<template>
	<view class="rank_container">
		<view class="margin-top">
			<view class="cu-list menu card-menu bg-white margin-bottom padding-bottom" v-for="(item,index) in ranklist" :key="index"  @tap="goShop(item)">
				<view class="cu-item margin-top">
					<view class="cu-avatar round lg margin-right" :style="'background-image:url('+item.shop_logo+');'">
					</view>
					<view class="content">
						<view class="text-grey flex">
							<view class="text-black text-fw600" style="line-height: 30rpx;">{{item.shop_name}}</view>
						</view>
						<view class="flex">
							<view class="cu-tag radius12 text-xs"style="margin-left: 0;margin-top:10rpx;background-color: #EFEFEF;">粉丝数:{{item.shop_collect || 0}}</view>
						</view>
					</view>
					<view class="action">
						<view class="flex align-center radius justify-center bg-theme margin-left" style="width: 100rpx; height: 40rpx;">
							<text class="text-white text-sm">进店</text>
						</view>
					</view>
				</view>
				<!-- <view class="radius20 overHidden flex justify-between align-center product_contianer">
					<view class="mianImg bg-img" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg);"> </view>
					<view class="rightImg">
						<view class="right-item bg-img" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg);"></view>
						<view class="right-item bg-img" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg);"></view>
					</view>
				</view> -->
			</view>
		</view>
	</view>
</template>

<script>
	import * as Main_API from '@/api/main/home.js' 
	export default {
		props:{
			ranklist:{
				type:Array,
				default:[]
			}
		},
		data(){
			return{
				avatar:['https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg','https://ossweb-img.qq.com/images/lol/web201310/skin/big81005.jpg','https://ossweb-img.qq.com/images/lol/web201310/skin/big25002.jpg','https://ossweb-img.qq.com/images/lol/web201310/skin/big99008.jpg'],
			}
		},
		methods:{
			goShop(item){
				Main_API.getShopInfo(item.shop_id).then(async res=>{
					console.log(res)
					if(res.shop_id){
						await uni.setStorageSync('shop',res)
						setTimeout(()=>{
							uni.reLaunch({
								url:'/pages/home/home'
							})
						},200)
					}
				}).catch(()=>{
					uni.showLoading({
						title:'店铺已不存在，换一个试试吧'
					})
				})
				
				// this.$Router.replaceAll('/pages/home/home?seller_id='+item.id)
			}
		}
	}
</script>

<style lang="scss" scoped>
	/deep/.cu-list.menu-avatar>.cu-item:after, .cu-list.menu>.cu-item:after {
		border-bottom: 0;
	}
	.rank_container{
		height: 100%;
	}
	.rank_icon{
		margin-right: 30rpx;
		width: 50rpx;
		text-align: center;
	}
	.rank_img{
		width: 50rpx;
		height: 50rpx;
	}
	.product_contianer{
		height: 380rpx;
		margin: 10rpx 30rpx 20rpx;
	}
	.mianImg{
		width: 380rpx;
		height: 100%;
		margin-right:1%;
	}
	.rightImg{
		flex:1;
		height:100%;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		.right-item{
			width: 100%;
			height: 49.5%;
		}
	}
</style>
